<head>
	<meta charset="UTF-8"/>
</head>
<script src="jquery-2.1.3.min.js" type="text/javascript"></script>
<script src="bootstrap.min.js"></script>
<script src="translate.js"></script>
<link rel="stylesheet" href="bootstrap.min.css">
<link rel="stylesheet" href="style.css">
<link rel="stylesheet" href="font-awesome.min.css">


<div style="position:absolute;top:5px;right:30px">
	<a href="#" id="close" class="text-danger"><i class="fa fa-times-circle-o" aria-hidden="true" style="font-size: 150%;"></i></a>
</div>


<h3><p class="text-center tr">Settings</p></h3>
<hr>

<div class="container">
	<div class="form-horizontal">

	  <div class="form-group form-item">
	    <label for="TopPanelHeight" class="col-sm-5 control-label tr">Top Panel Height (pixels)</label>
	    <div class="col-sm-4">
	    	<input type="number" class="form-control" id="TopPanelHeight" placeholder="Top Panel Height" min="100"> 
	    </div>
	  </div>
	  <div class="form-group form-item">
	    <label for="LeftPanelWidth" class="col-sm-5 control-label tr">Left Panel Width (pixels)</label>
	    <div class="col-sm-4">
	    	<input type="number" class="form-control" id="LeftPanelWidth" placeholder="Top Panel Height" min="100"> 
	    </div>

	  </div>
	  <div class="form-group form-item">
	    <label for="Zoom" class="col-sm-5 control-label tr">Zoom (%)</label>
	    <div class="col-sm-4">
	    	<input type="number" class="form-control" id="Zoom" placeholder="Zoom"> 
	    </div>
	  </div>


	  <div class="form-group">
	    <div class="col-sm-offset-5 col-sm-7">
	      <div class="checkbox">
	        <label>
	          <input type="checkbox" id="EnableFlash"> <span class="tr">Enable Flash</span>
	        </label>
	      </div>
	    </div>
	  </div>

	  <div class="form-group">
	    <div class="col-sm-offset-5 col-sm-7">
	      <div class="checkbox">
	        <label>
	          <input type="checkbox" id="IsSafe"> <span class="tr">Disable webrtc and canvas</span>
	        </label>
	      </div>
	    </div>
	  </div>


	  <div class="form-group form-item">
	    <label for="SkipFrames" class="col-sm-5 control-label tr">Skip Frames</label>
	    <div class="col-sm-4">
	    	<input type="number" class="form-control" id="SkipFrames" placeholder="SkipFrames" min="1">
	    </div>
	  </div>
	  <div class="text-center text-muted tr">Number of frames to skip in run mode. The higher the value, the lower the use of resources. 1 - means no skip, 75 is default value.</div>

	  <div class="form-group" style="margin-top:20px">
	    <div class="col-sm-offset-5 col-sm-7">
	      <div class="checkbox">
	        <label>
	          <input type="checkbox" id="ForceUTF8Encoding"> <span class="tr">Force UTF-8 Encoding</span>
	        </label>
	      </div>
	    </div>
	  </div>


	  <div class="form-group" style="margin-top:20px">
	    <div class="col-sm-offset-5 col-sm-7">
	      <div class="checkbox">
	        <label>
	          <input type="checkbox" id="RestartBrowserProcessOnThreadStart"> <span class="tr">Restart browser process on thread start</span>
	        </label>
	      </div>
	    </div>
	  </div>

	  <div class="form-group" style="margin-top:20px">
	    <div class="col-sm-offset-5 col-sm-7">
	      <div class="checkbox">
	        <label>
	          <input type="checkbox" id="UseHumanLikeMouseMoves"> <span class="tr">Emulate mouse movements</span>
	        </label>
	      </div>
	    </div>
	  </div>

	  <div class="form-group" style="margin-top:20px">
	    <div class="col-sm-offset-5 col-sm-7">
	      <div class="checkbox">
	        <label>
	          <input type="checkbox" id="ProxiesReconnect"> <span class="tr">Proxies reconnect</span>
	        </label>
	      </div>
	    </div>
	  </div>

	</div>
</div>

<hr>

<div class="container-fluid">
  <div class="col-xs-12 text-right">
    <a class="btn btn-success tr" href="#" id="ok" >Ok</a> <a class="btn btn-danger tr" href="#" id="cancel">Cancel</a> <a class="btn btn-info tr" href="#" id="defaults">Defaults</a>
  </div>
</div>
  

<script>
	function getParameterByName(name, url) {
	    if (!url) url = window.location.href;
	    name = name.replace(/[\[\]]/g, "\\$&");
	    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
	        results = regex.exec(url);
	    if (!results) return null;
	    if (!results[2]) return '';
	    return decodeURIComponent(results[2].replace(/\+/g, " "));
	}

	$( document ).ready(function() {
		$('*').on('dragstart', function(event) { event.preventDefault(); });
		tr()
		var json_string = getParameterByName("d")
		var json = JSON.parse(json_string)

		$("#TopPanelHeight").val(json["toolbox_height"])
		$("#LeftPanelWidth").val(json["scenario_width"])
		$("#Zoom").val(json["zoom"])
		$("#EnableFlash").prop("checked",json["use_flash"])
		$("#IsSafe").prop("checked",json["is_safe"])
		$("#SkipFrames").val(json["skip_frames"])
		$("#ForceUTF8Encoding").prop("checked",json["force_utf8"])
		$("#RestartBrowserProcessOnThreadStart").prop("checked",json["restart"])
		$("#UseHumanLikeMouseMoves").prop("checked",json["emulatemouse"])
		$("#ProxiesReconnect").prop("checked",json["proxies_reconnect"])

		

		$("#defaults").click(function(event){
    		event.preventDefault();
    		$("#TopPanelHeight").val("300")
			$("#LeftPanelWidth").val("500")
			$("#Zoom").val("100")
			$("#EnableFlash").prop("checked",false)
			$("#SkipFrames").val("1")
			$("#ForceUTF8Encoding").prop("checked",true)
			$("#IsSafe").prop("checked",true)
			$("#RestartBrowserProcessOnThreadStart").prop("checked",false)
			$("#UseHumanLikeMouseMoves").prop("checked",true)
			$("#ProxiesReconnect").prop("checked",false)
    	})

    	$("#close, #cancel").click(function(event){
    		event.preventDefault();
			BrowserAutomationStudio_Close();
    	})

    	$("#ok").click(function(event){
    		event.preventDefault();
    		BrowserAutomationStudio_SetOptions(JSON.stringify(
    			{
	    			"toolbox_height": parseInt($("#TopPanelHeight").val()),
	    			"scenario_width": parseInt($("#LeftPanelWidth").val()),
	    			"zoom": parseInt($("#Zoom").val()),
	    			"use_flash": $("#EnableFlash").prop("checked"),
	    			"is_safe": $("#IsSafe").prop("checked"),
	    			"skip_frames": parseInt($("#SkipFrames").val()),
	    			"force_utf8": $("#ForceUTF8Encoding").prop("checked"),
	    			"restart": $("#RestartBrowserProcessOnThreadStart").prop("checked"),
	    			"emulatemouse": $("#UseHumanLikeMouseMoves").prop("checked"),
	    			"proxies_reconnect": $("#ProxiesReconnect").prop("checked")
	    		}
    		));

			BrowserAutomationStudio_Close();
    	})
	});
</script>